<script setup>
</script>

<template>
  <div style="width: 80%; margin: auto">
    <div style="margin: 40px 0">
      <h1 style="font-size: 24px">概要</h1>
      <p>在此更新您的照片和个人详细信息。</p>
    </div>
    <ul>
      <li>
        <div>
          用户名：
        </div>
        <div>
          <el-input></el-input>
        </div>
      </li>
      <li>
        <div>
          头像: <br>
        </div>
        <div>
          <el-input></el-input>
        </div>
      </li>
    </ul>
    <div style="padding: 10px; text-align: right">
      <el-button>取消</el-button>
      <el-button type="primary">确定</el-button>
    </div>
  </div>
</template>

<style scoped>
  ul li {
    list-style: none;
    display: flex;
    height: 100px;
    border-bottom: 1px solid #eeeeee;
    line-height: 100px;
  }

  ul li div {
    width: 400px;
  }

</style>